import React, { Component, Suspense } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import routes from '../router';

const LazyRoute = ({ component: Component, ...rest }) => (
  <Suspense fallback={<div />}>
    <Route {...rest} render={() => <Component />} />
  </Suspense>
);

class App extends Component {
  render() {
    return (
      <Router>
        <div className="App">
          <Switch>
            {routes.map(route => (
              <LazyRoute key={route.path} {...route} />
            ))}
          </Switch>
        </div>
      </Router>
    );
  }
}

export default App;
